<template>
  <f7-page>
    <qm-currentcy-navbar title="工作">
      <template #nav-right>
        <f7-icon f7="ellipsis"></f7-icon>
      </template>
    </qm-currentcy-navbar>
    <div>
      <qm-block title="首页" class="qm-blo" :needpadding="false" >
        <div class="qm-entry">
          <qm-entry
            v-for="(item, index) in home"
            :key="index"
            :data="item"
            iconWidth="88"
            fontSize="24"
          ></qm-entry>
        </div>
      </qm-block>
      <qm-block title="资讯" class="qm-blo" :needpadding="false">
        <div class="qm-entry">
          <qm-entry
            v-for="(item, index) in information"
            :key="index"
            :data="item"
            iconWidth="88"
            fontSize="24"
          ></qm-entry>

        </div>
      </qm-block>
      <qm-block title="功能入口" class="qm-blo" :needpadding="false">
        <div class="qm-entry">
          <qm-entry
            v-for="(item, index) in entrance"
            :key="index"
            :data="item"
            iconWidth="88"
            fontSize="24"
          ></qm-entry>
        </div>
      </qm-block>
      <qm-block title="个人中心" class="qm-blo" :needpadding="false">
        <div class="qm-entry">
          <qm-entry
            v-for="(item, index) in center"
            :key="index"
            :data="item"
            iconWidth="88"
            fontSize="24"
          ></qm-entry>
        </div>
      </qm-block>
      <qm-block title="通知/搜索/消息" class="qm-blo" :needpadding="false">
        <div class="qm-entry">
          <qm-entry
            v-for="(item, index) in notice"
            :key="index"
            :data="item"
            iconWidth="88"
            fontSize="24"
          ></qm-entry>
        </div>
      </qm-block>
        <qm-block title="登录/注册" class="qm-blo" :needpadding="false">
        <div class="qm-entry">
          <qm-entry
            v-for="(item, index) in land"
            :key="index"
            :data="item"
            iconWidth="88"
            fontSize="24"
          ></qm-entry>
        </div>
      </qm-block>
      <qm-block title="步骤/信息录入" class="qm-blo" :needpadding="false">
        <div class="qm-entry">
          <qm-entry
            v-for="(item, index) in step"
            :key="index"
            :data="item"
            iconWidth="88"
            fontSize="24"
          ></qm-entry>
        </div>
      </qm-block>
      <qm-block title="列表页" class="qm-blo" :needpadding="false">
        <div class="qm-entry">
          <qm-entry
            v-for="(item, index) in list"
            :key="index"
            :data="item"
            iconWidth="88"
            fontSize="24"
          ></qm-entry>
        </div>
      </qm-block>
      <qm-block title="空白页" class="qm-blo" :needpadding="false">
        <div class="qm-entry">
          <qm-entry
            v-for="(item, index) in blankpage"
            :key="index"
            :data="item"
            iconWidth="88"
            fontSize="24"
          ></qm-entry>
        </div>
      </qm-block>
      <qm-block title="其他" :needpadding="false">
        <div class="qm-entry" >
          <qm-entry
            v-for="(item, index) in others"
            :key="index"
            :data="item"
            iconWidth="88"
            fontSize="24"
          ></qm-entry>
        </div>
      </qm-block>
    </div>
    <qmpanel></qmpanel>
    <f7-viewbar-instince slot="fixed"></f7-viewbar-instince>
  </f7-page>
</template>

<script>
import qmpanel from "../panel/index1.vue";
export default {
  components: {
    qmpanel,
  },
  data() {
    return {
      home: [
        {
          href: "/project/projectStatus",
          image: "static/img/function-entrance/index1/icon-work-rizhi.png",
          title: "工程状态",
        },
        {
          href: "/ui/home/index",
          image: "static/img/function-entrance/index1/icon-work-kaoqin.png",
          title: "首页1",
        },
        {
          href: "/ui/home/index-2",
          image: "static/img/function-entrance/index1/icon-work-qiandao.png",
          title: "首页2",
        },
        {
          href: "/ui/home/index-3",
          image: "static/img/function-entrance/index1/icon-work-qingjia.png",
          title: "首页3",
        },
        {
          href: "/ui/home/index-4",
          image: "static/img/function-entrance/index1/icon-work-waichu.png",
          title: "首页4",
        },
        {
          href: "/ui/home/index-5",
          image: "static/img/function-entrance/index1/icon-work-chuchai.png",
          title: "首页5",
        },
        {
          href: "/ui/home/index-6",
          image: "static/img/function-entrance/index1/icon-work-jiaban.png",
          title: "首页6",
        },
        {
          href: "/ui/terminal/index2",
          image: "static/img/function-entrance/index1/icon-work-jiaban.png",
          title: "终端",
        },
        {
          href:'/business/components/datePicker',
          image:'static/img/function-entrance/index1/icon-work-jiaban.png',
          title:'日期选择'
        }
      ],
      information: [
        {
          href: "/ui/information/index",
          image: "static/img/function-entrance/index1/icon-work-rizhi.png",
          title: "资讯首页",
        },
        {
          href: "/ui/information/agencyInformation",
          image: "static/img/function-entrance/index1/icon-work-jihua.png",
          title: "机关资讯",
        },
        {
          href: "/ui/information/information",
          image: "static/img/function-entrance/index1/icon-work-richeng.png",
          title: "资讯详情",
        },
        {
          href: "/ui/information/classify",
          image: "static/img/function-entrance/index1/icon-work-peixun.png",
          title: "分类选择器",
        },
        {
          href: "/ui/information/timePicker",
          image: "static/img/function-entrance/index1/icon-work-chaosong.png",
          title: "时间选择器",
        },
        {
          href: "/ui/datetime-picker/index",
          image: "static/img/function-entrance/index1/icon-work-kaoqin.png",
          title: "时间选择器2",
        },
        {
          href: "/ui/multiple-choice/index",
          image: "static/img/function-entrance/index1/icon-work-peixun.png",
          title: "分类选择器(单选/多选)",
        },
      ],
      entrance: [
        {
          href: "/ui/function-entrance/index1",
          image: "static/img/function-entrance/index1/icon-work-daipi.png",
          title: "功能入口1",
        },
        {
          href: "/ui/function-entrance/index2",
          image: "static/img/function-entrance/index1/icon-work-shenling.png",
          title: "功能入口2",
        },
        {
          href: "/ui/function-entrance/index3",
          image: "static/img/function-entrance/index1/icon-work-yongzhang.png",
          title: "物业管理",
        },
        {
          href: "/ui/function-entrance/index4",
          image: "static/img/function-entrance/index1/icon-work-yongzhang.png",
          title: "欢迎界面",
        },
        {
          href: "/ui/ungrouped/preComponent",
          image: "static/img/function-entrance/index1/icon-work-daipi.png",
          title: "预制构件",
        },
        {
          href: "/ui/log-on/index",
          image: "static/img/function-entrance/index1/icon-work-yongzhang.png",
          title: "登录界面",
        },
      ],
      center: [
        {
          href: "/ui/center/index1",
          image: "static/img/function-entrance/index1/icon-work-shenling.png",
          title: "我的1",
        },
        {
          href: "/ui/center/index2",
          image: "static/img/function-entrance/index1/icon-work-yongzhang.png",
          title: "我的2",
        },
        {
          href: "/ui/center/index3",
          image: "static/img/function-entrance/index1/icon-work-caigou.png",
          title: "我的3",
        },
        {
          href: "/ui/center/index4",
          image:
            "static/img/function-entrance/index1/icon-work-zhuanzheng.png",
          title: "我的4",
        },
        {
          href: "/ui/center/index5",
          image: "static/img/function-entrance/index1/icon-work-qiandao.png",
          title: "我的5",
        },
        {
          href: "/ui/center/index6",
          image: "static/img/function-entrance/index1/icon-work-qingjia.png",
          title: "我的6",
        },
        {
          href: "/ui/set/index",
          image: "static/img/function-entrance/index1/icon-work-daipi.png",
          title: "设置",
        },
      ],
      notice: [
        {
          href: "/ui/notice/index1",
          image: "static/img/function-entrance/index1/icon-work-daipi.png",
          title: "通知",
        },
        {
          href: "/ui/notice/index5",
          image: "static/img/function-entrance/index1/icon-work-shenling.png",
          title: "通讯录",
        },
        {
          href: "/ui/notice/index4",
          image: "static/img/function-entrance/index1/icon-work-yongzhang.png",
          title: "消息",
        },
        {
          href: "/ui/search/index",
          image: "static/img/function-entrance/index1/icon-work-qiandao.png",
          title: "搜索",
        },
        {
          href: "/ui/search/index2",
          image: "static/img/function-entrance/index1/icon-work-qiandao.png",
          title: "搜索2",
        },
      ],
      step: [
        {
          href: "/ui/step/index1",
          image: "static/img/function-entrance/index1/icon-work-kaoqin.png",
          title: "步骤1",
        },
        {
          href: "/ui/step/index2",
          image: "static/img/function-entrance/index1/icon-work-kaoqin.png",
          title: "步骤2",
        },
        {
          href: "/ui/step/index3",
          image: "static/img/function-entrance/index1/icon-work-kaoqin.png",
          title: "步骤3",
        },
        {
          href: "/ui/blank-page/pageSuccessWithButton",
          image: "static/img/function-entrance/index1/icon-work-qiandao.png",
          title: "完成预约",
        },
        {
          href: "/ui/step/index5",
          image: "static/img/function-entrance/index1/icon-work-qingjia.png",
          title: "信息填写输入框左右对齐",
        },
        {
          href: "/ui/step/index6",
          image: "static/img/function-entrance/index1/icon-work-waichu.png",
          title: "输入框已填（左右）",
        },
        {
          href: "/ui/step/index7",
          image: "static/img/function-entrance/index1/icon-work-chuchai.png",
          title: "输入框左对齐",
        },
        {
          href: "/ui/step/index8",
          image: "static/img/function-entrance/index1/icon-work-jiaban.png",
          title: "输入框已填（左齐）",
        },
        {
          href: "/ui/step/index9",
          image: "static/img/function-entrance/index1/icon-work-rizhi.png",
          title: "输入框左对齐2",
        },
      ],
      land:[
          {
          href: "/ui/land/index1",
          image: "static/img/function-entrance/index1/icon-work-qiandao.png",
          title: "登录/注册1",
        },
         {
          href: "/ui/land/index2",
          image: "static/img/function-entrance/index1/icon-work-daipi.png",
          title: "登录/注册2",
        },
         {
          href: "/ui/land/index3",
          image: "static/img/function-entrance/index1/icon-work-peixun.png",
          title: "登录/注册3",
        },
         {
          href: "/ui/land/index4",
          image: "static/img/function-entrance/index1/icon-work-yongzhang.png",
          title: "登录/注册4",
        },
         {
          href: "/ui/land/index5",
          image: "static/img/function-entrance/index1/icon-work-peixun.png",
          title: "登录/注册5",
        },
         {
          href: "/ui/land/index6",
          image: "static/img/function-entrance/index1/icon-work-chuchai.png",
          title: "登录/注册6",
        },
         {
          href: "/ui/land/index7",
          image: "static/img/function-entrance/index1/icon-work-shenpi.png",
          title: "登录/注册7",
        },
         {
          href: "/ui/land/index8",
          image: "static/img/function-entrance/index1/icon-work-peixun.png",
          title: "登录/注册8",
        },
         {
          href: "/ui/land/index9",
          image: "static/img/function-entrance/index1/icon-work-qiandao.png",
          title: "登录/注册9",
        },{
          href: "/ui/land/index10",
          image: "static/img/function-entrance/index1/icon-work-chaosong.png",
          title: "登录/注册10",
        },{
          href: "/ui/land/index11",
          image: "static/img/function-entrance/index1/icon-work-chuchai.png",
          title: "登录/注册11",
        },{
          href: "/ui/land/index12",
          image: "static/img/function-entrance/index1/icon-work-jiaban.png",
          title: "登录/注册12",
        },
      ],
      list: [
        {
          href: "/ui/list/index",
          image: "static/img/function-entrance/index1/icon-work-kaoqin.png",
          title: "列表页首页",
        },
        {
          href: "/ui/list/itemDetail",
          image: "static/img/function-entrance/index1/icon-work-qiandao.png",
          title: "列表页详情",
        },
        {
          href: "/ui/list/subscribeList",
          image: "static/img/function-entrance/index1/icon-work-qingjia.png",
          title: "会议室预约",
        },
        {
          href: "/ui/list/courseList",
          image: "static/img/function-entrance/index1/icon-work-waichu.png",
          title: "课程列表",
        },
        {
          href: "/ui/list/agencyMatters",
          image: "static/img/function-entrance/index1/icon-work-chuchai.png",
          title: "代办事项",
        },
        {
          href: "/ui/list/entrustList",
          image: "static/img/function-entrance/index1/icon-work-jiaban.png",
          title: "代办事项-委托函",
        },
        {
          href: "/ui/list/productStatusList",
          image: "static/img/function-entrance/index1/icon-work-rizhi.png",
          title: "代办事项-产品状态",
        },
        {
          href: "/ui/list/agencyList",
          image: "static/img/function-entrance/index1/icon-work-jihua.png",
          title: "审批系统",
        },
        {
          href: "/ui/list/projectList",
          image: "static/img/function-entrance/index1/icon-work-richeng.png",
          title: "项目列表",
        },
        {
          href: "/ui/list/itemQuery",
          image: "static/img/function-entrance/index1/icon-work-peixun.png",
          title: "项目查询",
        },
      ],
      blankpage: [
        {
          href: "/ui/feedback/index",
          image: "static/img/function-entrance/index1/icon-work-jihua.png",
          title: "弹出框",
        },
        {
          href: "/ui/blank-page/black/page404",
          image: "static/img/function-entrance/index1/icon-work-kaoqin.png",
          title: "404",
        },
        {
          href: "/ui/blank-page/black/pageDataEmpty",
          image: "static/img/function-entrance/index1/icon-work-kaoqin.png",
          title: "数据为空",
        },
        {
          href: "/ui/blank-page/black/pageFolderEmpty",
          image: "static/img/function-entrance/index1/icon-work-kaoqin.png",
          title: "文件夹为空",
        },
        {
          href: "/ui/blank-page/black/pageLoadFailed",
          image: "static/img/function-entrance/index1/icon-work-qiandao.png",
          title: "加载失败",
        },
        {
          href: "/ui/blank-page/black/pageLoading",
          image: "static/img/function-entrance/index1/icon-work-qingjia.png",
          title: "加载中",
        },
        {
          href: "/ui/blank-page/black/pageNetworkUngeliable",
          image: "static/img/function-entrance/index1/icon-work-waichu.png",
          title: "网络不给力",
        },
        {
          href: "/ui/blank-page/black/pageNoBankCard",
          image: "static/img/function-entrance/index1/icon-work-chuchai.png",
          title: "没绑定银行卡",
        },
        {
          href: "/ui/blank-page/black/pageNoCollect",
          image: "static/img/function-entrance/index1/icon-work-jiaban.png",
          title: "收藏夹为空",
        },
        {
          href: "/ui/blank-page/black/pageNoCoupons",
          image: "static/img/function-entrance/index1/icon-work-rizhi.png",
          title: "无优惠券可用",
        },
        {
          href: "/ui/blank-page/black/pageNoData",
          image: "static/img/function-entrance/index1/icon-work-jihua.png",
          title: "暂无数据",
        },
        {
          href: "/ui/blank-page/black/pageNoDirection",
          image: "static/img/function-entrance/index1/icon-work-richeng.png",
          title: "暂无方向",
        },
        {
          href: "/ui/blank-page/black/pageNoMessage",
          image: "static/img/function-entrance/index1/icon-work-peixun.png",
          title: "暂无消息",
        },
        {
          href: "/ui/blank-page/black/pageNoNetwork",
          image: "static/img/function-entrance/index1/icon-work-daipi.png",
          title: "无网络",
        },
        {
          href: "/ui/blank-page/black/pageNoPermission",
          image: "static/img/function-entrance/index1/icon-work-kaoqin.png",
          title: "无权访问",
        },
        {
          href: "/ui/blank-page/black/pageNoRecord",
          image: "static/img/function-entrance/index1/icon-work-kaoqin.png",
          title: "暂无记录",
        },
        {
          href: "/ui/blank-page/black/pageNoSchedule",
          image: "static/img/function-entrance/index1/icon-work-kaoqin.png",
          title: "暂无日程",
        },
        {
          href: "/ui/blank-page/black/pageNoSearchResults",
          image: "static/img/function-entrance/index1/icon-work-qiandao.png",
          title: "搜索无果",
        },
        {
          href: "/ui/blank-page/black/pageNoSignal",
          image: "static/img/function-entrance/index1/icon-work-qingjia.png",
          title: "暂无信号",
        },
        {
          href: "/ui/blank-page/black/pageShoppingCartEmpty",
          image: "static/img/function-entrance/index1/icon-work-waichu.png",
          title: "购物车为空",
        },
        {
          href: "/ui/blank-page/pageSuccessWithButton",
          image: "static/img/function-entrance/index1/icon-work-shenpi.png",
          title: "操作成功提示",
        },
        {
          href: "/ui/blank-page/pageSuccess",
          image: "static/img/function-entrance/index1/icon-work-shenpi.png",
          title: "操作成功提示2",
        },
        {
          href: "/ui/blank-page/pageLoading",
          image: "static/img/function-entrance/index1/icon-work-chaosong.png",
          title: "加载页面",
        },
        {
          href: "/ui/blank-page/pageLost",
          image: "static/img/function-entrance/index1/icon-work-shenling.png",
          title: "页面丢失",
        },
        {
          href: "/ui/blank-page/pageNetworkDesert",
          image: "static/img/function-entrance/index1/icon-work-yongzhang.png",
          title: "网络不佳",
        },
        {
          href: "/ui/blank-page/pageNetworkError",
          image: "static/img/function-entrance/index1/icon-work-yongzhang.png",
          title: "网络错误",
        },
        {
          href: "/ui/blank-page/pageNoAccess",
          image: "static/img/function-entrance/index1/icon-work-yongzhang.png",
          title: "没有访问权",
        },
        {
          href: "/ui/blank-page/pageNotAboutData",
          image: "static/img/function-entrance/index1/icon-work-shenpi.png",
          title: "没有相关数据",
        },
        {
          href: "/ui/blank-page/pageNotFind",
          image: "static/img/function-entrance/index1/icon-work-shenpi.png",
          title: "没搜出来",
        },
        {
          href: "/ui/blank-page/pageUnderDevelop",
          image: "static/img/function-entrance/index1/icon-work-chaosong.png",
          title: "开发中",
        },
        {
          href: "/ui/send-verification-code/index",
          image: "static/img/function-entrance/index1/icon-work-chaosong.png",
          title: "输入框",
        },
        {
          href: "/ui/button/index",
          image: "static/img/function-entrance/index1/icon-work-qingjia.png",
          title: "按钮",
        },
      ],
      others: [
        {
          href: "/business/components/index",
          image: "static/img/function-entrance/index1/icon-work-kaoqin.png",
          title: "组件",
        },
        {
          href: "/business/index",
          image: "static/img/function-entrance/index1/icon-work-qiandao.png",
          title: "首页",
        },
        {
          href: "/ui/popover/index",
          image: "static/img/function-entrance/index1/icon-work-qingjia.png",
          title: "气泡框",
        },
        {
          href: "/ui/badge/index",
          image: "static/img/function-entrance/index1/icon-work-waichu.png",
          title: "徽标",
        },
        {
          href: "/ui/tag/index",
          image: "static/img/function-entrance/index1/icon-work-chuchai.png",
          title: "标签",
        },
        {
          href: "/setting/app",
          image: "static/img/function-entrance/index1/icon-work-qiandao.png",
          title: "易招标",
        },
        {
          href: "/setting/devices",
          image: "static/img/function-entrance/index1/icon-work-qingjia.png",
          title: "设备",
        },
      ],
    };
  },
};
</script>

<style lang="less" scoped>
/deep/.page-content {
  // padding-top: calc(88px * var(--ratio));
  .qm-block {
    padding: calc(16px * var(--ratio)) 0 0 0;
    .qm-block-title {
      // margin-left: calc(32px * var(--ratio));
      font-size: var(--font-size-subtitle);
    }
    .qm-block-content {
      margin-top: calc(16px * var(--ratio));
    }
  }
}

/deep/.qm-entry {
  display: grid;
  grid-template-columns: repeat(4, 25%);
  grid-row-gap: calc(32px * var(--ratio));
  .entry .entry-title {
    margin-top: calc(8px * var(--ratio));
  }
}

.qm-blo::after {
  content: "";
  width: 92%;
  height: calc(24px * var(--ratio));
  display: block;
  margin: 10px auto 0px;
  border-bottom: 1px solid var(--color-divider-background);
}
</style>
